<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>廣告時間軸</title>

<!-- Framework CSS -->
<link rel="stylesheet" href="../css/blueprint/screen.css" type="text/css" media="screen, projection" />
<link rel="stylesheet" href="../css/blueprint/print.css" type="text/css" media="print" />
<!--[if lt IE 8]><link rel="stylesheet" href="css/blueprint/ie.css" type="text/css" media="screen, projection" /><![endif]-->
<link href="../css/tigerBackoffice11.css" rel="stylesheet" type="text/css" media="screen, projection" />
<!--[if IE 6]><link href="css/tigerBackoffice11IE6.css" rel="stylesheet" type="text/css" media="screen, projection" /><![endif]-->
 <style type="text/css">
		@import url("/ad/html/js/timeline_2.3.0/timeline_js/timeline-bundle.css");
		
		body {
		    margin-bottom: 20em;
		}
		
		table {
		    font-size: 100%;
		}
		
		.timeline-default {
		    font-family: Trebuchet MS, Helvetica, Arial, sans serif;
		    font-size: 8pt;
		    border: 1px solid #aaa;
		}
		.tape-special_event, .small-special_event {background-color: orange;}
	</style>
	 <script type="text/javascript">
        Timeline_ajax_url="/ad/html/js/timeline_2.3.0/timeline_ajax/simile-ajax-api.js";
        Timeline_urlPrefix='/ad/html/js/timeline_2.3.0/timeline_js/';       
        Timeline_parameters='bundle=true';
    </script>
	<script type="text/javascript" src="/ad/html/js/dateFormat.js"></script>
    <script src="/ad/html/js/timeline_2.3.0/timeline_js/timeline-api.js?bundle=true" type="text/javascript"></script>
    <script>
    
    
    
        var tl;
        function onLoad() {
            var eventSource = new Timeline.DefaultEventSource(0);
            
            var theme = Timeline.ClassicTheme.create();
            theme.event.bubble.width = 250;
            theme.event.bubble.height = 250;
            // theme.event.instant.icon = "no-image-40.png";
          //  theme.event.instant.iconWidth = 40;  // These are for the default stand-alone icon
           // theme.event.instant.iconHeight = 40;
            var nowdate = new Date();
            var dateStr =dateFormat(new Date(), "yyyy-mm-dd");
            
            var d = Timeline.DateTime.parseIso8601DateTime(dateStr);
            
            var bandInfos = [
                Timeline.createBandInfo({
                    width:          "93%", 
                    intervalUnit:   Timeline.DateTime.WEEK, 
                    intervalPixels: 150,
                    eventSource:    eventSource,
                    date:           d,
                    theme:          theme
                }),
                Timeline.createBandInfo({
                    width:          "7%", 
                    intervalUnit:   Timeline.DateTime.MONTH, 
                    intervalPixels: 100,
                    eventSource:    eventSource,
                    date:           d,
                    theme:          theme,
                    layout:         'overview'  // original, overview, detailed
                })
            ];
            bandInfos[1].syncWith = 0;
            //bandInfos[1].highlight = true;
            
            tl = Timeline.create(document.getElementById("tl"), bandInfos, Timeline.HORIZONTAL);
            tl.loadJSON("data.php?"+ (new Date().getTime()), function(json, url) { eventSource.loadJSON(json, url); });
        }
        
        var resizeTimerID = null;
        function onResize() {
            if (resizeTimerID == null) {
                resizeTimerID = window.setTimeout(function() {
                    resizeTimerID = null;
                    tl.layout();
                }, 500);
            }
        }
       
    </script>
	
</head>
<body onload="onLoad();" onresize="onResize();" style="">
  
 
	<div id="MainConteiner-in">
	<p>&nbsp;</p>	
	<h2>廣告時間軸  &nbsp;</h2>
	<div id="ResaultTable">
		   <div id="tl"   style="height: 550px;"></div>
	</div>
	</div>
</body>
</html>


 
 